import React,{memo,useState} from 'react'
// import './Server.style.js'
import { connect } from 'react-redux'
import Scroll from '../../baseUI/scroll'
import ServerSearchInput from '@/components/ServerSearchInput/ServerSearchInput'
import ServerPopup from '@/components/server/ServerPopup/ServerPopup'

const Server = (props)=>{
    const {category} = props
    const handleonclick =()=>{
        //console.log('----------------');
        setServerDisplay(!serverDisplay)
    }
    
    const [serverDisplay,setServerDisplay]=useState(false)
    return (
        <Scroll
            direction="vertical"
            refresh={false}
        >
            <div>
                <ServerSearchInput handlenOnclick={handleonclick}/>
                <ServerPopup
                    display={serverDisplay}
                    handleOnclick={handleonclick}
                />
            </div>
        </Scroll>
    )
}

const mapStateToProps=(state)=>{
    return {
        category:state.server.category
    }
}

export default connect(mapStateToProps,{})(memo(Server))